//新闻 news tbody id
var news_row_tbody = document.querySelector("#news_row_tbody");
//新闻 tbody下面的tr id
var news_row = document.querySelector("#news_row");
//新闻 图片按钮
var news_img_btn = document.querySelector("#news_img_btn");
//新闻 内容按钮
var news_text_btn = document.querySelector("#news_text_btn");
//新闻 删除按钮
var news_del_btn = document.querySelector("#news_del_btn");
//新闻 选择页数 选项框
var news_page_select = document.querySelector("#news_page_select");

// fetch获取新闻内容 渲染到页面 方法
function render_news_content(page = 1, limit = 10) {
  // 发送请求
  fetch(`${apirUrl}/api/getnews_page?page=${page}&lines=${limit}`)
    .then((res) => res.json())
    .then((res) => {
      console.log(res);
      // 清空tbody
      news_row_tbody.innerHTML = "";
      // 渲染
      for (let i = 0; i < res.data.length; i++) {
        var html = `
        <tr id="news_row">
              <th scope="row">${res.data[i].id}</th>
              <td>${res.data[i].newsid}</td>
              <td>${res.data[i].title}</td>
              <td>${res.data[i].date}</td>
              <td>${res.data[i].keyword}</td>
              <td><button id="news_img_btn" imgsrc="${res.data[i].imgsrc}" class="btn btn-success">图片</button></td>
              <td>${res.data[i].pageViews}</td>
              <td><button id="news_text_btn" class="btn btn-success">内容</button></td>
              <td><button id="news_del_btn" class="btn btn-danger">删除</button></td>
        </tr>
        `;
        news_row_tbody.innerHTML += html;
      }
      //重新获取news_row 当最后一个td 删除按钮点击 获取到该行 第二列newsid
      news_row = document.querySelectorAll("#news_row");
      //   console.log(news_row);
      //给删除按钮添加点击事件
      var news_del_btn = document.querySelectorAll("#news_del_btn");
      for (let i = 0; i < news_row.length; i++) {
        news_del_btn[i].onclick = function () {
          // console.log(news_row[i].children[1].innerHTML);
          //   console.log(`点击了删除按钮${news_row[i].children[1].innerHTML}`);
          // 发送请求
          var urlencoded = new URLSearchParams();
          urlencoded.append("newsid", news_row[i].children[1].innerHTML);

          var requestOptions = {
            method: "POST",
            body: urlencoded,
            redirect: "follow",
          };

          fetch(`${apirUrl}/api/delete_news_by_newsid`, requestOptions)
            .then((res) => res.json())
            .then((res) => {
              console.log(res);
              if (res.status == 0) {
                console.log("删除成功");
                me_uto.innerHTML = "删除成功";
                toast_body.innerHTML = "成功删除该条新闻内容！";
                toast.show();
                //重新获取新闻页数
                get_news_page();
                //重新获取新闻内容
                render_news_content(1);
              } else {
                console.log("删除失败");
              }
            });
        };
      }
      //当news_img_btn点击时 跳转到新闻图片页面
      var news_img_btn = document.querySelectorAll("#news_img_btn");
      for (let i = 0; i < news_img_btn.length; i++) {
        news_img_btn[i].onclick = function () {
          //获取imgsrc属性值
          var imgsrc = news_img_btn[i].getAttribute("imgsrc");
          //跳转到新标签页 新闻图片页面
          window.open(`${apirUrl}${imgsrc}`);
        };
        //当 news_text_btn 点击时 获取该行的newsid 并跳转到新闻内容页面
        var news_text_btn = document.querySelectorAll("#news_text_btn");
        for (let i = 0; i < news_text_btn.length; i++) {
          news_text_btn[i].onclick = function () {
            //获取newsid
            var newsid =
              news_text_btn[i].parentNode.parentNode.children[1].innerHTML;
            //跳转到新标签页 新闻内容页面
            window.open(`${serverUrl}/view.html?newsid=${newsid}`);
          };
        }
      }
    });
}
render_news_content();
var refresh_news = document.querySelector("#refresh_news");
refresh_news.addEventListener("click", function () {
  get_news_page();
  render_news_content();
});

//fetch  获取新闻页数
function get_news_page(num = 10) {
  fetch(`${apirUrl}/api/getnews_page_num?lines=${num}`)
    .then((res) => res.json())
    .then((res) => {
      // console.log(res);
      // 清空select
      news_page_select.innerHTML = "";
      // 渲染
      for (let i = 1; i <= res.pageNum; i++) {
        var html = `
        <option value="${i}">${i}</option>
        `;
        news_page_select.innerHTML += html;
      }
    });
}
get_news_page();
//当select变化时，将变化的值传给render_news_content
news_page_select.addEventListener("change", function () {
  render_news_content(this.value);
});
